import React, { Component } from 'react'
import {Button,Typography } from 'antd';
import {DingdingOutlined, DownloadOutlined} from '@ant-design/icons';
import Test from './components/Test'
import './App.less';

const { Paragraph } = Typography;

export default class App extends Component {
    state = {
        msg: 'I Love You'
    }

    render() {
        return (
            <div style={{padding: '50px'}} className="container">
                <h2>按钮</h2>
                <Button type="primary">Primary Button</Button>
                <Button danger={true}>危险</Button>
                <Button type="primary" icon={<DownloadOutlined />} size="middle" />
                <h2>图标</h2>
                <DingdingOutlined />
                <h2>可编辑的元素</h2>
                <Paragraph editable={{ onChange: this.change }}>{this.state.msg}</Paragraph>
                <h2>useState</h2>
                <Test />
            </div>
        )
    }

    change = (v) => {
        this.setState({
            msg: v
        })
    }
}
